{template 'web/hairsalon/base_menu'}
<script>
    require(['bootstrap'],function($){
        $('.tips').hover(function(){
            $(this).tooltip('show');
        },function(){
            $(this).tooltip('hide');
        });
    });
</script>
<div class="top_tab">
    <a href="{php echo $this->createWebUrl('timecard',array('op'=>'categorydisplay'))}" class="layui-btn {if $operation!='categorydisplay'}layui-btn-primary{/if}">次卡列表</a>
    {if $operation=='categorypost'}
    <a href="{php echo $this->createWebUrl('timecard',array('op'=>'categorypost'))}" class="layui-btn {if $operation!='categorypost'}layui-btn-primary{/if}">编辑次卡</a>
    {/if}
    <a href="{php echo $this->createWebUrl('timecard',array('op'=>'display'))}" class="layui-btn {if $operation!='display'}layui-btn-primary{/if}">销售明细</a>
    {if $operation=='post'}
    <a href="{php echo $this->createWebUrl('timecard',array('op'=>'history'))}" class="layui-btn {if $operation!='history'}layui-btn-primary{/if}">使用明细</a>
    {/if}
</div>
<style>
    .panelbox-head i{ color:#009688;}
    .panelbox-head a{ display:inline-block; margin-right:10px}
</style>
{if $operation == 'categorydisplay'}
<div class="panelbox">
    <div class="panelbox-head">
        <A href="{php echo $this->createWebUrl('timecard',array('op' => 'categorypost'))}"><i class="fa fa-plus"></i> 新增</A>
    </div>
    <form action="" method="post" class="layui-form" id="listform" enctype="multipart/form-data">
        <div class="panelbox-body">
            <div class="layui-form">
                <table class="layui-table">
                    <thead>
                    <tr>
                        <th style="width:30px;">#</th>
                        <th>名称</th>
                        <th>价格</th>
                        <th>提成</th>
                        <th>消费内容</th>
                        <th>有效期</th>
                        <th style="text-align:right">操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    {loop $category $row}
                    <tr>
                        <td></td>
                        <td>{$row['title']}</td>
                        <td>{$row['price']}</td>
                        <td>{php echo $this->_2money($row['performance'])}</td>
                        <td>
                            {php $content=json_decode($row['content'],true);}
                            {loop $content $index $rew}
                            <p>{php echo $objary[$index]}：{$rew}次</p>
                            {/loop}
                        </td>
                        <td>{if $row['deadline']}<span class="label label-info">{$row['deadline']}天</span>{/if}</td>
                        <td style="text-align:right">
                            <a href="JavaScript:sendbox({$row['id']})" class="btn btn-info btn-sm tips" data-toggle="tooltip" data-placement="bottom" title="发卡"><i class="layui-icon">&#xe657;</i></a>
                            <a href="{php echo $this->createWebUrl('timecard',array('op' => 'display','cid' => $row['id']))}" class="btn btn-info btn-sm tips" data-toggle="tooltip" data-placement="bottom" title="销售明细"><i class="layui-icon">&#xe614;</i></a>
                            <a href="{php echo $this->createWebUrl('timecard',array('op' => 'categorypost', 'id' => $row['id']))}" class="btn btn-default btn-sm tips" data-toggle="tooltip" data-placement="bottom" title="编辑"><i class="layui-icon">&#xe642;</i></a>
                            <a href="javascript:deleteContent('{php echo $this->createWebUrl('timecard',array('op'=>'categorydelete','id'=>$row['id']))}')" class="btn btn-danger btn-sm tips" data-toggle="tooltip" data-placement="bottom" title="删除"><i class="layui-icon">&#xe640;</i></a>
                        </td>
                    </tr>
                    {/loop}
                    </tbody>
                </table>
            </div>
        </div>
    </form>
</div>
<style>
    #membergetcard layui-input,#membergetcard input{margin: 0}
    #membergetcard select{display: block}
</style>
<div class="membergetcardbox" style="display: none;overflow: visible">
    <form id="membergetcard" class="layui-form" action="" style="padding:15px">
        <input type="hidden" id="memberid" />
        <input type="hidden" id="cardid" />
        <table class="layui-table" lay-skin="nob">
            <colgroup>
                <col width="250">
                <col width="250">
            </colgroup>
            <tbody>
            <tr>
                <td><input type="text" readonly id="membercardno" class="layui-input"></td>
                <td><input type="text" readonly id="memberwxcardno" class="layui-input"></td>
            </tr>
            <tr>
                <td><input type="text" readonly id="memberrealname" class="layui-input"></td>
                <td class="form-inline text-center"><input type="text" style="width:105px" readonly id="membercredit" class="form-control"> <input type="text" readonly id="membercash" style="width:105px" class="form-control"></td>
            </tr>
            <tr>
                <td colspan="2"><input type="text" readonly id="timecardtitle" class="layui-input"></td>
            </tr>
            <tr>
                <td>
                    <select class="form-control" id="paytype" lay-ignore>
                        <option value="-1" selected>赠送</option>
                        <option value="2">现金购买</option>
                        <option value="3">银行卡购买</option>
                        <option value="4">余额购买</option>
                    </select>
                </td>
                <td><input type="text" id="price" placeholder="支付金额" value="" class="layui-input"></td>
            </tr>
            <tr>
                <td class="dropup">
                    <input type="text" id="sid" sid="" placeholder="销售员工" value="" class="layui-input" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true" oninput="fun_searchuser(this)">
                    <ul class="dropdown-menu">
                        {loop $projectlist $row}
                        <li><a href="JavaScript:addnewproject(1,{$row['id']})">{$row['title']}</a></li>
                        {/loop}
                    </ul>
                </td>
                <td><input type="text" id="performance" placeholder="提成" value="" class="layui-input"></td>
            </tr>
        </table>
    </form>
</div>
<script language="JavaScript">

    function sendbox(cardid){
        layer.prompt({
            formType: 0,
            title: '请输入会员卡号/电话',
        }, function(value, index, elem){
            var index2=layer.load(1, {shade: [0.1,'#fff']});
            $.post("{php echo $this->createWebUrl('timecard',array('op'=>'getonemember'))}",{keyword:value},function(returnstr){
                layer.close(index2);
                console.log(returnstr);
                var result=eval("("+returnstr+")");
                if(result.success){
                    layer.close(index);
                    showMember(result.member,cardid);
                }else{
                    layer.msg(result.msg ? result.msg : returnstr,{icon:2,time:2000});
                }
            });
        });
    }
    function showMember(member,cardid){
        layer.open({
            type: 1,
            title:"发卡",
            btn: ['确认', '关闭'],
            area:"530px",
            btn1:function(index,layero){
                layer.confirm('确认发卡？', function(indexx){
                    layer.close(indexx);
                    buyCard();
                });
            },
            content: $(".membergetcardbox").show(),
            success:function(){
                $("#membergetcard")[0].reset();
                $("#membercardno").val(member.cardno);
                $("#memberwxcardno").val(member.wxcardno);
                $("#memberrealname").val(member.realname);
                $("#membercredit").val(member.credit1);
                $("#membercash").val(member.credit2);
                $("#memberid").val(member.id);
                $("#cardid").val(cardid);
                var index2=layer.load(1, {shade: [0.1,'#fff']});
                $.post("{php echo $this->createWebUrl('timecard',array('op'=>'gettimecardcate'))}",{id:cardid},function(returnstr){
                    layer.close(index2);
                    console.log(returnstr);
                    var result=eval("("+returnstr+")");
                    if(result.success){
                        var item=result.item;
                        $("#timecardtitle").val(item.title);
                        $("#price").val(item.price);
                        $("#performance").val(fee2num(item.performance));
                    }else{
                        layer.msg(result.msg ? result.msg : returnstr,{icon:2,time:2000},function(){
                            layer.closeAll();
                        });
                    }
                });
            },
            end:function(){
                $(".membergetcardbox").hide();
            }
        });
    }
    function buyCard(){

        var memberid=$("#memberid").val();
        var cardid=$("#cardid").val();
        var paytype=$("#paytype option:selected").val();
        var fee=$("#price").val();
        var sid=parseInt($("#sid").attr("sid"));
        var performance=$("#performance").val();
        var param={
            memberid:memberid,
            cardid:cardid,
            paytype:paytype,
            fee:fee,
            sid:sid,
            performance:performance,
        };
        var index2=layer.load(1, {shade: [0.1,'#fff']});
        $.post("{php echo $this->createWebUrl('timecard',array('op'=>'selltimecard'))}",param,function(returnstr){
            layer.close(index2);
            console.log(returnstr);
            var result=eval("("+returnstr+")");
            if(result.success){
                layer.msg("购买成功",{icon:1,time:2000},function(){
                    layer.closeAll();
                });
            }else{
                layer.msg(result.msg ? result.msg : returnstr,{icon:2,time:2000},function(){
                    layer.closeAll();
                });
            }
        });
    }

    function fun_searchuser(obj){
        $(obj).next("ul").empty();
        var keyword=$(obj).val().trim();
        $.post("{php echo $this->createWebUrl('timecard',array('op'=>'getstaff'))}",{keyword:keyword},function(returnstr){
            console.log(returnstr);
            var result=eval("("+returnstr+")");
            if(result.success){
                var list=result.list;
                var temp='';
                for(var i in list){
                    temp+='<li ><a href="JavaScript:selectstaff('+list[i].id+',\''+list[i].realname+'\')">('+list[i].useracount+') '+list[i].realname+'</a></li>';
                }
                if(temp=='')temp='<li><a href="JavaScript:">-</a></li>';
                $(obj).next("ul").html(temp);
                if($(obj).next("ul").is(":hidden"))$(obj).click().focus();
            }
        });
    }
    function selectstaff(id,realname){
        $("#sid").val(realname).attr("sid",id);
    }
</script>
{elseif $operation == 'categorypost'}
<style>
    #plist li{margin-bottom: 5px;}
</style>

<div class="panelbox">
    <form action="" method="post" class="layui-form" enctype="multipart/form-data">
        <input type="hidden" name="id" value="{php echo $id}" />
        <div class="panelbox-body">
            <div class="layui-form-item">
                <label class="layui-form-label">标题</label>
                <div class="layui-input-block">
                    <input type="text" class="form-control" value="{$item['title']}" name="title"/>
                    <div class="help-block">次卡标题</div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">说明</label>
                <div class="layui-input-block form-inline">
                    <textarea name="description" placeholder="次卡说明" class="layui-textarea">{$item['description']}</textarea>
                    <div class="help-block">次卡说明</div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">销售价格</label>
                <div class="layui-input-block form-inline">
                    <input type="number" class="form-control" value="{$item['price']}" name="price"/>
                    <div class="help-block">价格，单位元</div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">提成</label>
                <div class="layui-input-block form-inline">
                    <input type="number" class="form-control" value="{php echo $this->_2money($item['performance'])}" name="performance"/>
                    <div class="help-block">提成，单位元。每销售一张卡可获得提成</div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">有效期</label>
                <div class="layui-input-block form-inline">
                    <input type="number" class="form-control" value="{$item['deadline']}" placeholder="有效天数" name="deadline"/>
                    <div class="help-block">0为不限制，填写1为1天，客户领卡后1内有效。</div>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">消费内容</label>
                <div class="layui-input-block">
                    <input type="hidden" name="content" id="content" value="" />
                    <ul id="plist" class="form-inline">
                        {loop $content $index $row}
                        <li><input type="text" readonly class="form-control panme" value="{php echo $objary[$index]}" onclick="addproject(this)"> : <input type="hidden" class="pid" value="{$index}"><input type="text" class="form-control pnum" value="{$row}"> <a href="javascript:" onclick="deletethis(this)" class="btn btn-danger btn-sm">&times;</a></li>
                        {/loop}
                    </ul>
                    <p style="margin-top:10px"><button type="button" class="btn btn-info" onclick="addproject()">增加项目</button> </p>
                    <div class="help-block">上述添加项目均可使用</div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label"></label>
                <div class="layui-input-block">
                    <input type="hidden" name="token" value="{$_W['token']}" />
                    <input class="layui-btn col-md-1" type="submit" name="submit"  onclick="return checkmyform();" value="保存">
                </div>
            </div>
        </div>
    </form>
</div>
<style>
    .projectcatelist li{padding: 10px; text-align: center;border-bottom: 1px solid #CCC;cursor: pointer;}
    .projectlist{border-left: 1px solid #CCC; height: 400px; overflow-y: scroll;}
    .projectlist li{padding: 10px 15px;border-bottom: 1px solid #CCC;cursor: pointer;}
    .projectlist li:hover{background: #EEE;}
    .projectlist li.isselect{background:#00a0f8;color: #FFF;}
</style>
<div id="projectbox" style="display: none;">
    <div>
        <div class="layui-row">
            <div class="layui-col-md3">
                <ul class="projectcatelist">
                    {loop $category $row}
                    <li onclick="jsJumpto({$row['id']})">{$row['title']}</li>
                    {/loop}
                </ul>
            </div>
            <div class="layui-col-md9">
                <ul class="projectlist">
                    {php $pcate=0;}
                    {loop $list $row}
                    <li {if $pcate!=$row['pcate']}pcate="{$row['pcate']}"{/if} pid="{$row['id']}" onclick="choosethis({$row['id']},'{$row['title']}')" pid="{$row['id']}" title="{$row['title']}">{$row['title']}<span class="pull-right"><small>￥</small>{$row['price']}</span></li>
                    {php $pcate=$row['pcate']}
                    {/loop}
                </ul>
            </div>
        </div>
    </div>
</div>
<script language="javascript">
    layui.use(['layer', 'laypage', 'element','form'], function(){
        var layer = layui.layer
                ,laypage = layui.laypage
                ,element = layui.element
                ,form = layui.form;
        form.render();
    });
    function checkmyform(){
        if($("#plist li").size()<1){
            layer.msg("请选择项目",{icon:2,time:1500});
            return false;
        }
        var temp=[];
        $("#plist li").each(function(){
            var pid=$(this).find(".pid").val();
            var val=parseInt($(this).find(".pnum").val());
            if(val==0){
                layer.msg("项目数量不能为0",{icon:2,time:1500});
                return false;
            }
            temp.push(pid+"#"+val);
        });
        $("#content").val(temp.join(","));
        console.log(temp.join(","));
        return true;
    }
    function deletethis(obj){
        $(obj).parent().remove();
    }
    function jsJumpto(obj){
        $(".projectlist").scrollTop($(".projectlist li[pcate='"+obj+"']").offset().top);
    }
    var chooseid=0;
    function addproject(){
        if(arguments.length){
            var obj=arguments[0];
            chooseid=$(obj).attr("pid");
        }
        layer.open({
            type: 1,
            title:"选择项目",
            area:"500px",
            btn: ['关闭'],
            btn1:function(index,layero){
                layer.close(index);
            },
            content: $("#projectbox").show(),
            success:function(){
                $(".projectlist").scrollTop(0);
                $(".projectlist li").removeClass("isselect");
                $("#plist .pid").each(function(){
                    var pid=$(this).val();
                    $(".projectlist li[pid='"+pid+"']").addClass("isselect");
                });
            },
            end:function(){
                chooseid=0;
                $("#projectbox").hide();
            }
        });
    }
    function choosethis(id,title){
        if(chooseid && chooseid==id){
            layer.msg("该项目已选择",{icon:2,time:1500});
            return;
        }
        if($("#plist .panme[pid='"+id+"']").size()){
            layer.msg("该项目已选择",{icon:2,time:1500});
            return;
        }
        if(chooseid){
            $("#plist .panme[pid='"+chooseid+"']").val(title);
            $("#plist .panme[pid='"+chooseid+"'] .pid").val(id);
        }else{
            var temp='<li><input type="text" readonly class="form-control panme" value="'+title+'" onclick="addproject(this)" /> : <input type="hidden" class="pid" value="'+id+'"><input type="text" class="form-control pnum" value="1"> <a href="javascript:" onclick="deletethis(this)" class="btn btn-danger btn-sm">&times;</a></li>';
            $("#plist").append(temp);
        }
        $(".projectlist li[pid='"+id+"']").addClass("isselect");
    }
</script>

{elseif $operation == 'display'}
<div class="panelbox">
    <div class="panelbox-head form-inline">
        <form action="" method="get">
        <select class="form-control" name="stype" lay-ignore>
            <option value="1">会员卡号/电话</option>
            <option value="2">次卡卡号</option>
        </select>
        <select class="form-control" name="cid" lay-ignore>
            <option value="">卡类别</option>
            {loop $categoryAry $inedx $row}
            <option value="{$inedx}">{$row}</option>
            {/loop}
        </select>
        <input type="text" class="form-control" name="keyword" placeholder="关键字">
        <button class="btn btn-info" type="submit">搜索</button>
        </form>
    </div>
    <form action="" method="post" class="layui-form" enctype="multipart/form-data">
        <div class="panelbox-body">
            <div class="layui-form">
                <table class="layui-table">
                    <thead>
                    <tr>
                        <th>卡号</th>
                        <th>所属会员</th>
                        <th>取得方式</th>
                        <th>销售价格</th>
                        <th>提成</th>
                        <th>消费内容</th>
                        <th>有效期</th>
                        <th style="text-align:right">操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    {loop $list $row}
                    <tr>
                        <td>{$row['timecardno']}</td>
                        <td style="font-size:70%">
                            <p>{$row['realname']}</p>
                            {php echo $row['cardno'] ? $row['cardno'] : $row['wxcardno']}
                        </td>
                        <td>
                            {if $row['paytype']==-1}
                            <span class="label label-danger">赠送</span>
                            {elseif $row['paytype']==2}
                            <span class="label label-warning">现金</span>
                            {elseif $row['paytype']==3}
                            <span class="label label-warning">银行卡</span>
                            {elseif $row['paytype']==4}
                            <span class="label label-info">余额</span>
                            {else}
                            <span class="label label-default">其他</span>
                            {/if}
                        </td>
                        <td>{php echo $this->_2money($row['total_fee'])}</td>
                        <td>{php echo $this->_2money($row['performance'])}</td>
                        <td>
                            {php $content=json_decode($row['content'],true);}
                            {loop $content $index $rew}
                            <p>{php echo $objary[$index]}：{$rew}次</p>
                            {/loop}
                        </td>
                        <td>{if $row['endtime']}<span class="label label-info">{php echo date("Y-m-d",$row['endtime'])}</span>{/if}</td>
                        <td style="text-align:right">
                            <a href="{php echo $this->createWebUrl('timecard',array('op' => 'history','cid' => $row['id']))}" class="btn btn-info tips" data-toggle="tooltip" data-placement="bottom" title="消费明细"><i class="layui-icon">&#xe614;</i></a>
                            <a href="{php echo $this->createWebUrl('timecard',array('op' => 'timecardpost', 'id' => $row['id']))}" class="btn btn-default tips" data-toggle="tooltip" data-placement="bottom" title="编辑"><i class="layui-icon">&#xe642;</i></a>
                            <a href="javascript:deleteContent('{php echo $this->createWebUrl('timecard',array('op'=>'timecarddelete','id'=>$row['id']))}')" class="btn btn-danger tips" data-toggle="tooltip" data-placement="bottom" title="删除"><i class="layui-icon">&#xe640;</i></a>
                        </td>
                    </tr>
                    {/loop}
                    </tbody>
                </table>
                <div class="text-right">{$pager}</div>
            </div>
        </div>
    </form>
</div>
{/if}
<script>
    function deleteContent(url){
        layer.confirm('确认删除此内容？删除后将不可恢复', {}, function(){
            location.href=url;
        });
    }
</script>